<template>
	<view class="cashier" style="justify-content: start;">
		<view class="cashier-con">
		 
		 
			<view class="">
			<!-- 	<view class="" style="padding-left: 30rpx;padding-top: 40rpx;">
					<view class="" style="font-size: 26rpx;">
						付款金额
					</view>
					<view class="" style="margin-top: 40rpx;padding-bottom: 40rpx;border-bottom: 1rpx solid #ECECEC;display: flex;align-items: center;">
						<text style="font-size: 40rpx;margin-right: 30rpx;">￥ {{price}}</text>
				 
					</view>
				</view> -->
				<view class="cashier-view" style="margin: 0;" >
					<text style="font-size: 24rpx;">待支付金额</text>
					 
					<text class="price">{{ price }}</text>
				</view>
				<view class="" style="background-color: #FBFBFB;height: 20rpx;">
					
				</view>
				<view class="" style="background-color: white;padding-top: 40rpx;padding-left: 30rpx;">
					<view class="">
							订单编号：{{order_no}}
					</view>
					<view class="" style="margin-top: 40rpx;padding-bottom: 20rpx;">
						支付方式：
					</view>
				</view>
			</view>
			<view class="payType">
				<view class="payType-list" @tap="radioChange(1)">
					<view class="payType-text">
						<image mode="widthFix" src="/static/image/index/add_images/yl.png"></image>
						<span style="margin-left: 10rpx;">汇付-快捷支付</span>
					</view>
					<view>
						<radio value="1" :checked="radioVal == 1 ? true : false"
							:color="radioVal == 1 ? '#FF2842' : ''" />
					</view>
				</view>
			 
				 
			</view>
			<!-- <view class="payType" v-else>
				<view class="payType-list" @tap="radioChange(3)">
					<view class="payType-text">
						<image mode="widthFix" :src="Url + 'add_images/ic-int.png'"></image>
						积分支付
						<text>(可用{{ blance.integral }}积分)</text>
					</view>
					<view><radio value="3" :checked="radioVal == 3 ? true : false" :color="radioVal == 3 ? '#FF2842' : ''" /></view>
				</view>
			</view> -->
		</view>
		<button class="cashier-btn" :loading="loading" @tap="topay" style="margin-top: 70rpx;">立即支付</button>
		<shop-loading v-if="shopLoad"></shop-loading>
	</view>
</template>

<script>
import { cashierTotal, payDo,behalfPay,behalfPayDo } from '@/common/index.js';
import { debounce } from '@/static/js/utils.js';
export default {
	data() {
		return {
			Url: this.Imgurl,
			radioVal: 1,
			type: 1,
			loading: false,
			id: 0,
			blance: {},
			shopLoad: true,
			opsData: {}, //拼团团id
			order_no:'',
			price:''
			 
		};
	},
	onLoad(ops) {
		// console.log(ops)
 
		 
		  console.log(ops)
		
		// this.opsData = data;
		// this.type = data.type;
		  this.id = ops.order_id;
		// this.state = data.state
		  this.cashierTotal();
		// this.radioVal = data.type != 2 ? 1 : 3
	},
	methods: {
		cashierTotal() {
			// const { id, type } = this;
			  this.shopLoad = true;
			  behalfPay({id:this.id}).then((res)=>{
				  console.log(res);
				  this.shopLoad = false;
				  this.order_no = res.msg.order_no;
				  this.price = res.msg.pay_price;
			  })
			// cashierTotal({ id, type }).then(res => {
			// 	if (res.code == 1) {
			// 		this.blance = res.msg;
			// 		this.blance.balance = +res.msg.balance;
			// 		this.blance.pay_price = +res.msg.pay_price;
			// 		this.shopLoad = false;
			// 	} else {
			// 		this.shopLoad = false;
			// 	}
			// });
		},
		radioChange(type) {
			if (type == 2) {
				if (this.blance.balance >= this.blance.pay_price) {
					this.radioVal = type;
				}
			} else {
				this.radioVal = type;
			}
		},
		//微信调起支付
		wePay(params) {
			payDo(params)
				.then(res => {
					if (res.code == 1) {
						// this.toast(res.msg)
						if (!uni.getSystemInfoSync().version) {
							this.h5pay(res.msg, params);
						} else {
							this.wechatPay(res.msg, params);
						}
					}
				})
				.catch();
		},
		//支付
		topay:debounce(function(){
			
			// behalfPayDo({id:this.id}).then((res)=>{
			// 	console.log(res);
			// 	if(res.code == 1){
			// 		uni.reLaunch({
			// 			url: '/pageD/pay-Success/pay-Success?payType=1&type=1&order_no=' + this.order_no + '&price=' + this.price
			// 		});
			// 	}
			// })
			
			
			
			
			// return
			const { radioVal, id, type, opsData } = this;
 
			let version = uni.getSystemInfoSync().version ? 1 : 2;
			const versionFlag = uni.getSystemInfoSync().version;
			let params = {
				id,
				type,
				pay_type: radioVal == 3 ? 2 : radioVal,
				version
			};
			if (radioVal == 1) {
				//快捷支付
				let faildata = JSON.stringify(params);
				uni.showModal({
					title: '支付',
					content: '确定支付吗?',
					success: res => {
						if (res.confirm) {
							behalfPayDo(params)
								.then(res => {
									if (res.code == 1) {
										//this.toast(res.msg);
										window.location.href = res.msg;
										// if (type != 3) {
										// 	uni.reLaunch({
										// 		url: '/pageD/pay-Success/pay-Success?payType=1&type='+type
										// 	});
										// } else {
										// 	if(!versionFlag){
										// 		window.location.href = 'https://shop.jyecloud.cn/h5/pageB/groupTuxedo/groupTuxedo?id='+opsData.user_assemble_id+'&type='+type;
										// 	}else{
										// 		uni.reLaunch({
										// 			url: '/pageB/groupTuxedo/groupTuxedo?id='+opsData.user_assemble_id+'&type='+type
										// 		});
										// 	}
										// }
									}
								})
								.catch();
						} else if (res.cancel) {
							let lo = JSON.stringify(opsData)
							// console.log(lo,faildata)
							uni.reLaunch({
								url: '/pageD/pay-Success/pay-Success?payType=2&data=' + faildata+'&canData='+lo
							});
						}
					}
				});
			} else {
				//this.wePay(params);
			}
		},500),
		wechatPay(params, item) {
			this.loading = true;
			const {type, opsData} = this;
			let faildata = JSON.stringify(item);
			const versionFlag = uni.getSystemInfoSync().version;
			uni.requestPayment({
				provider: 'wxpay',
				timeStamp: params.timeStamp,
				nonceStr: params.nonceStr,
				package: params.package,
				signType: params.signType,
				paySign: params.paySign,
				success: res => {
					this.loading = false;
					console.log(res);
					if(type != 3){
						uni.reLaunch({
							url: '/pageD/pay-Success/pay-Success?payType=1&type='+type
						})
					}else{
						let lo = JSON.stringify(opsData)
						if(!versionFlag){
							window.location.href = 'https://shop.jyecloud.cn/h5/pageB/groupTuxedo/groupTuxedo?id='+opsData.user_assemble_id+'&type='+type
						}else{
							uni.reLaunch({
								url: '/pageB/groupTuxedo/groupTuxedo?id='+opsData.user_assemble_id+'&type='+type
							});
						}
						// uni.reLaunch({
						// 	url: '/pageB/groupTuxedo/groupTuxedo?data='+lo
						// });
					}
				},
				fail: err => {
					this.loading = false;
					let lo = JSON.stringify(opsData)
					uni.reLaunch({
						url: '/pageD/pay-Success/pay-Success?payType=2&data=' + faildata+'&canData='+lo
					});
					// console.log('fail:' + JSON.stringify(err));
				}
			});
		},
		h5pay(params, item) {
			this.loading = true;
			const {type, opsData} = this;
			let faildata = JSON.stringify(item);
			console.log(params);
			const versionFlag = uni.getSystemInfoSync().version;
			WeixinJSBridge.invoke(
				'getBrandWCPayRequest',
				{
					appId: params.appId, //公众号名称，由商户传入
					timeStamp: params.timeStamp, //时间戳，自1970年以来的秒数
					nonceStr: params.nonceStr, //随机串
					package: params.package,
					signType: params.signType, //微信签名方式：
					paySign: params.paySign //微信签名
				},
				res => {
					if (res.err_msg == 'get_brand_wcpay_request:ok') {
						this.loading = false;
						if(type != 3){
							uni.reLaunch({
								url: '/pageD/pay-Success/pay-Success?payType=1&type='+type
							})
						}else{
							let lo = JSON.stringify(opsData)
							if(!versionFlag){
								window.location.href = 'https://shop.jyecloud.cn/h5/pageB/groupTuxedo/groupTuxedo?id='+opsData.user_assemble_id+'&type='+type
							}else{
								uni.reLaunch({
									url: '/pageB/groupTuxedo/groupTuxedo?id='+opsData.user_assemble_id+'&type='+type
								});
							}
						}
						
						//var url = window.location.host;
						//location.href = "https://" + url + "/h5/pages/order/index";
						// 使用以上方式判断前端返回,微信团队郑重提示：
						//res.err_msg将在用户支付成功后返回ok，但并不保证它绝对可靠。
					} else {
						this.loading = false;
						let lo = JSON.stringify(opsData)
						uni.reLaunch({
							url: '/pageD/pay-Success/pay-Success?payType=2&data=' + faildata+'&canData='+lo
						});
					}
				}
			);
		}
	}
};
</script>
<style>
page {
	height: 100%;
}
</style>
<style lang="scss">
	
uni-page-body {
	-webkit-overflow-scrolling: touch;
	height: 100%;
	background: white;
	width: 100%;
	font-size: 15px;
	font-family: NotoSansHans-Bold;
	color: #333;
	overflow-x: hidden;
}
.cashier {
	height: 100%;
	width: 100%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	overflow-x: hidden;
	&-btn {
		width: calc(100% - 30upx);
		margin: 30upx auto;
		display: block;
		padding: 5px 0;
		border-radius: 10upx;
		font-size: 32upx;
		color: #ffffff;
		background-color: #ff2842;
		&::after {
			border: none;
		}
	}
	&-view {
		width: 100%;
		padding: 81upx 0;
		box-sizing: border-box;
		background-color: #ffffff;
		margin: 20upx 0;
		text {
			display: block;
			text-align: center;
			font-size: 36upx;
			color: #333333;
			margin-bottom: 30upx;
			&:last-child {
				font-size: 50upx;
				font-weight: bold;
			}
			&.price{
				&::before {
					content: '￥';
					font-size: 40upx;
				}
			}
		}
	}
	.payType {
		width: 100%;
		background-color: #ffffff;
		margin: 0 auto;
		.payType-xia {
			height: 2upx;
			width: 90%;
			background-color: #f9f9f9;
			display: block;
			margin: 0 auto;
		}
		.payType-list {
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 26upx;
			box-sizing: border-box;
			.payType-text {
				font-size: 28upx;
				color: #333333;
				display: flex;
				align-items:center;
				image {
					width: 36upx;
					height: 36upx;
					margin-right: 10upx;
				}
				text {
					font-size: 20upx;
					color: #999999;
				}
			}
			/deep/ {
				uni-radio .uni-radio-input {
					-webkit-appearance: none;
					appearance: none;
					margin-right: 5px;
					outline: 0;
					border: 1px solid #d1d1d1;
					background-color: #fff;
					border-radius: 50%;
					width: 36upx;
					height: 36upx;
					position: relative;
				}
			}
		}
	}
}
</style>
